<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
    <meta charset="UTF-8">
    <title>web小项目</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet">
</head>
<body ng-controller="myCtrl" style="padding: 10px">
<div style="width: 300px;">
    <div class="input-group">
        <input ng-model="task" type="text" class="from-control" required="true">
        <span class="input-group-btn">
            <button class="btn btn-default" ng-click="add()">提交</button>
        </span>
    </div>
    <h4 ng-hide="tasks.length == 0">任务列表</h4>
   <!-- <h4 ng-if="tasks.length > 0">任务列表</h4>-->
    <ul class="list-group">
        <li ng-repeat="x in tasks track by $index" class="list-group-item">{{x}} <a  ng-click="tasks.splice($index,1)">删除</a> </li>
    </ul>
</div>
</body>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script type="text/javascript">
    var myApp = angular.module("myApp", []);
    myApp.controller("myCtrl", function ($scope) {
        $scope.task = "";
        $scope.tasks = [];
        $scope.add = function(){
            $scope.tasks.push( $scope.task);
        };
    });
</script>
</html>